<template>
	<view class="container">
		<view class="content">
			<view class="kongbai">
				<view class="name_value">
					<view><input class="name_input" style="font-size:40upx;" :value="add_yangshi.name"/></view>
					<view><input class="name_input" style="font-size:40upx;" :value="add_yangshi.value"/></view>
				</view>
				<view class="jianshu">
					<textarea class="textarea" :value="add_yangshi.miaoshu"></textarea>
				</view>
				
			</view>
			<view class="morenzhi">
				<view>默认值</view>
			</view>
			<view class="liebiao">
				<uni-grid :column="1" :show-border="false"  :square="false" @change="change">
					<uni-grid-item class="leibieliebiao" v-for="(item, index) in add_yangshi.moren_value" :key="index">
						<!-- <image class="ysyimage" :src="item.image" mode="aspectFill" ></image> -->
						<view class="neirongqu"><input class="name_input text morenzhi1" :value="item.value"/>
							<view class="icon_image_view">
								<image class="icon_image" :src="item.icon_image" mode="aspectFit"></image>
							</view>
							<button class="text button">示例图上传</button>
							<button class="text button delete">删除</button>
						</view>
					</uni-grid-item>
					<view class="button_anniu xinzeng">新增默认值</view>
					<view class="liubai"></view>
				</uni-grid>
			</view>
			</view>
			<view class="button_anniu baocun">保存</view>
		</view>
	</view>
</template>

<script>
	import uniGrid from "@/components/uni-grid/uni-grid.vue"
	import uniGridItem from "@/components/uni-grid-item/uni-grid-item.vue"
	export default {
	    components: {uniGrid,uniGridItem},
			data() {
				return {
					add_yangshi:{}
				}
			},
			async onLoad(option){
				this.add_yangshi = await this.$api.json('add_yangshi');
				console.log(JSON.stringify(this.add_yangshi));
			},
			onShow() {
				// let params = {
				// 	"canshu1": this.add_yangshi.canshu1
				// };
				// upload_data(params, 'GET', this.$api.Apiurl.gongzuotaishouye_urlData.url, (res) => {
				// 	if (res.data.code == 1) {
				// 		this.add_yangshi = this.$api.Json.add_yangshi;
				// 	} else {
				// 		msg(res.data.msg);
				// 	}
				// });
			},
			methods:{
				change(e) {
					let {
						index
					} = e.detail
					let link_url = this.add_yangshi.moren_value[index].url;
					uni.navigateTo({
						url:link_url
					})
				}
			}
	}
</script>

<style>
	
	.leibiaofenlei{
		margin-top: 50upx;
	}
	.image_set{
		width: 120upx;
		height: 120upx;
	}
	.text{
		color: #707070;
		font-size: 30upx;
		flex:3;
		text-align: left;
	}
	.ysyimage{
		width: 120upx;
		height: 120upx;
	}
	.leibieliebiao{
		
		border-bottom: 2upx solid #909399;
		height: 130upx;
		line-height: 80upx;
		
	}
	.icon_image_view{
		width: 90upx;
		height: 90upx;
		flex:2;
	}
	.icon_image{
		width: 100%;
		height: 100%;
	}
	.neirongqu{
		display: flex;
		width: 90%;
		line-height: 100upx;
	}
	.button{
		background-color: #4CD964;
		color: #FFFFFF;
		flex:2;
		text-align: center;
		height: 41px;
	}
	.baocun{
		position: fixed;
		bottom:0;
		left:0;
	}
	.xinzeng{
		width: 90%;
		margin: 0upx auto;
		margin-top: 20upx;
		background-color: #0081FF;
	}
	.name_value{
		width: 90%;
		height: 150upx;
		display: flex;
		justify-content: space-around;
		line-height: 150upx;
		border-bottom: 2upx solid #707070;
		padding: 0upx 20upx;
	}
	.jianshu{
		width: 90%;
		/* height: 200upx; */
		padding: 10upx 40upx;
		border-bottom: 2upx solid #707070;
		font-size: 30upx;
		color: #909399;
	}
	.liubai{
		width: 100%;
		height: 141upx;
	}
	.morenzhi{
		width: 100%;
		height: 100upx;
		display: flex;
		justify-content: space-around;
		line-height: 100upx;
		border-bottom: 2upx solid #707070;
		background-color: #EDEDED;
	}
	.name_input{
		width: 100%;
		height: 100%;
		font-size: 30upx;
	}
	.textarea{
		width: 100%;
		overflow: auto;
		word-break: break-all; 
	}
	.morenzhi1{
		height: 90upx;
		line-height: 90upx;
		
	}
	.delete{
		background-color: #FA436A;
	}
</style>
